<!--  -->
<template>
	<div class="content">
		<p class="name">账号设置</p>
		<div class="list">
			<div class="line" @click="toPage('/pages/setting/information/index')">
				<div class="left">
					<image src="./img/icon_01.png" mode="widthFix"></image>
				</div>
				<div class="right">
					个人资料
					<c-icon color="#999" :size="40" />
				</div>
			</div>
			<div class="line" @click="toPage('/pages/setting/safe/index')">
				<div class="left">
					<image src="./img/icon_02.png" mode="widthFix"></image>
				</div>
				<div class="right">
					账号安全
					<c-icon color="#999" :size="40" />
				</div>
			</div>
		</div>
		<p class="name">系统设置</p>
		<div class="list">
			<div class="line">
				<div class="left">
					<image src="./img/icon_03.png" mode="widthFix"></image>
				</div>
				<div class="right">
					推送设置
					<u-switch v-model="checked" active-color="#476bff" inactive-color="#c8c8c8" size="30"></u-switch>
				</div>
			</div>
			<div class="line">
				<div class="left">
					<image src="./img/icon_04.png" mode="widthFix"></image>
				</div>
				<div class="right">
					清除缓存
					<c-icon color="#999" :size="40" />
				</div>
			</div>
			<div class="line">
				<div class="left">
					<image src="./img/icon_05.png" mode="widthFix"></image>
				</div>
				<div class="right">
					用户反馈
					<c-icon color="#999" :size="40" />
				</div>
			</div>
			<div class="line">
				<div class="left">
					<image src="./img/icon_06.png" mode="widthFix"></image>
				</div>
				<div class="right">
					关于华创
					<c-icon color="#999" :size="40" />
				</div>
			</div>
			<div class="line">
				<div class="left">
					<image src="./img/icon_07.png" mode="widthFix"></image>
				</div>
				<div class="right">
					版本更新
					<c-icon color="#999" :size="40" />
				</div>
			</div>
			<div class="line" @click="logOut">
				<div class="left">
					<image src="./img/icon_08.png" mode="widthFix"></image>
				</div>
				<div class="right">
					退出登录
					<c-icon color="#999" :size="40" />
				</div>
			</div>
		</div>
	</div>
</template>

<script>
import mixin from "@/mixin"
export default {
	mixins: [mixin],
	data() {
		return {
			checked: false,
		}
	},

	components: {},

	computed: {},

	methods: {
		logOut() {
			uni.showModal({
				title: "提示",
				content: "确定退出登录吗？",
				success: res => {
					if (res.confirm) {
						this.$store.commit("user/logout")
						this.toPage("/pages/login/index")
					}
				},
			})
		},
	},
}
</script>
<style lang="scss">
page {
	background: $page-bg;
}
</style>
<style lang="scss" scoped>
.content {
	.name {
		padding: 45rpx 30rpx 25rpx;
		color: #999;
		font-size: 26rpx;
		line-height: 1;
	}
	.list {
		padding: 0 0 0 30rpx;
		background: #fff;
		border-bottom: 1rpx solid #f1f1f1;
		border-top: 1rpx solid #f1f1f1;
		.line {
			display: flex;
			align-items: center;

			.left {
				padding-right: 60rpx;
				image {
					width: 29rpx;
				}
			}
			.right {
				padding: 30rpx 30rpx 30rpx 0;
				flex: 1;
				line-height: 1;
				display: flex;
				align-items: center;
				justify-content: space-between;
				border-bottom: 1rpx solid #f1f1f1;
			}
		}
	}
}
</style>
